<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>form</title>
    <script type="text/javascript">
        window.onload=function () {
            document.getElementById("name").focus();
            document.getElementById("form1").onsubmit=function () {
                validate();
            }
        }
        function validate() {
            var sname=document.getElementById("name").value;
            var sage=document.getElementById("age").value;
            var semail=document.getElementById("email").value.indexOf("@")
            if(sname.length>10||sname.length<=0){
                alert("名字（1-10个字符）");
                document.getElementById("name").focus();
                return false;
            }
            if(isNaN(sage)||sage<1||sage>100){
                alert("年龄（从1到100）");
                document.getElementById("sage").focus();
                return false;
            }
            if(semail==-1){
                alert("不是有效的电子邮件");
                document.getElementById("email").focus();
                return false;
            }
        }
    </script>
</head>
<body>
<form action="" id="form1">
    <label>名字（1-10个字符）：</label>
    <input type="text" id="name" size="10"><br>
    <label>年龄（从1到100）：</label>
    <input type="text" id="age" size="3"><br>
    <label>电子邮件：</label>
    <input type="text" id="email" size="21"><br>
    <input type="submit" value="提交">
</form>
</body>
</html>